/**
 * 载入项目引导文件
 */
require('./bootstrap');

window.Vue = require('vue');

//时间控件，官网：https://github.com/weifeiyue/vue-datepicker-local
import VueDatepickerLocal from 'vue-datepicker-local'

const app = new Vue({
    el: '#wrapper',
    data:{
        table:null,
        searchParams:{
            keyword:'',
            openid:'',
            start_time:'',
            end_time:'',
        },
        start_time:'',
        end_time:'',
    },
    watch:{
        start_time:function (val) {
            var d = new Date(val);
            let format = d.getFullYear() + '-' + (d.getMonth() + 1) + '-' + d.getDate() + ' ' + d.getHours() + ':' + d.getMinutes() + ':' + d.getSeconds();
            this.searchParams.start_time = format;
        },
        end_time:function (val) {
            var d = new Date(val);
            let format = d.getFullYear() + '-' + (d.getMonth() + 1) + '-' + d.getDate() + ' ' + d.getHours() + ':' + d.getMinutes() + ':' + d.getSeconds();
            this.searchParams.end_time = format;
        }
    },
    mounted:function(){
        let tableOptions = utils.bootstraptableOptions;
        //请求后台的URL
        tableOptions.url = page_params.url_list;
        //搜索参数
        tableOptions.queryParams = (params) => {//传递参数（*）
            //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
            var temp = {
                pageSize:params.pageSize,
                page:params.pageNumber,
            };
            return _.merge(temp, this.searchParams);
        };
        tableOptions.columns = [
            {field: 'id',title: '序号'},
            {field: 'msg_id',title: '消息ID',},
            {field: 'to_user_name',title: '开发者微信号',visible:false,},
            {field: 'from_user_name',title: '发送方账号'},
            {field: 'location_x',title: '地理位置纬度'},
            {field: 'location_y',title: '地理位置经度'},
            {field: 'scale',title: '地图缩放大小'},
            {field: 'label',title: '地理位置信息'},
            {field: 'create_time',title: '发送时间'},
        ];
        this.table = $("#table").bootstrapTable(tableOptions);
    },
    methods: {
        query: function () {
            this.table.bootstrapTable('refresh');
        },
    },
    components: {
        VueDatepickerLocal
    },
});